<template>
	<view class="wraptop">
		<view class="content_input">
			<input type="text" value="" v-model="userinfo.phone" class="input_cot" style="text-align: left;border-radius: 40px;background-color: rgb(250,250,250);"
			 placeholder="手机号" />
			 <input type="text" value="" v-model="userinfo.account" class="input_cot" style="text-align: left;border-radius: 40px;background-color: rgb(250,250,250);"
			  placeholder="账号" />
			<view style="position: relative;">
				<input type="text" value="" v-model="userinfo.captcha" class="input_cot" style="text-align: left;border-radius: 40px;background-color: rgb(250,250,250);font-size: 14px;"
				 placeholder="验证码" />
				<button id="button"  :disabled="disbtn" style="position: absolute; top:11%; right: 10%; color:#dbdbdb;font-size: 14px;z-index: 99;" @click="countTime(60)" hover-class="none">{{text}}</button>
			</view>
			<input type="password" value="" v-model="userinfo.password" class="input_cot" style="text-align: left;border-radius: 40px;background-color: rgb(250,250,250);"
			 placeholder="密码" />
			 <input type="password" value="" v-model="userinfo.tpassword" class="input_cot" style="text-align: left;border-radius: 40px;background-color: rgb(250,250,250);"
			  placeholder="确认密码" />
		</view>
		<view class="btn" @click="regup">
			<text>完成</text>
		</view>
<!-- 		<view class="" @click="testmima">
			修改密码
		</view> -->
		<!-- 		<view class="bottom_cont">
			<text>《使用条款和隐私政策》</text>
			<text @click="gologin">已经有账户了！ 登陆</text>
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				　　countdown: 60,
				　　btnDisabled: false,
				　　text: '获取验证码',
				disbtn:false,
				view_class: {
					height: ""
				},
				userinfo: {
					account: '',
					tpassword: '',
					captcha: '',
					password:'',
					phone:''
				}
			}
		},
		onLoad: function() {
			this.view_class.height = uni.getSystemInfoSync().windowHeight
			console.log(this.view_class.height)
		},
		methods: {
			
			countTime(second) {
				this.disbtn=true
			    let intervalTimer = setInterval(() => {
			        second -= 1;
			        if (second >= 0) {
			            // Vue中的写法
			            this.text = second + "s后重新获取";
			            this.btnDisabled = true;
			        } else {
			            clearInterval(intervalTimer);
			            // Vue中的写法
						this.disbtn=false
			            this.text = "获取验证码";
			            this.codeBtnDisabled = false;
			        }
					
			    }, 1000);
				uni.request({
				    url: this.G_base+'/api/register/verify',
				    data: {
				       type:"login",
					   phone:this.userinfo.phone
				    },
					method:"POST",
				    header: {
				        'content-type':'application/x-www-form-urlencoded' 
				    },
				    success: (res) => {
					
				        console.log(res)
				        if(res.data.status=200){
							uni.showToast({
								title:res.data.msg
								
							})
						}else{
							uni.showToast({
								title:res.data.msg,
								image:'../../static/jinggao.png'
							})
						}
				    },
					fail: (err) => {
						console.log(err)
					}
				});
				
			},
			regup() {

				let myreg=/^[1][3,4,5,7,8][0-9]{9}$/;
				if(myreg.test(this.userinfo.account)){
					uni.showToast({
						title:"手机号格式错误",
						duration:1000,
						image:"../../static/jinggao.png"
					})
					return
				}else{		
					console.log(this.userinfo.account,this.userinfo.captcha,this.userinfo.tpassword)
					uni.request({
					    url: this.G_base+'/api/register/reset',
					    data: {
					       account:this.userinfo.account,
						   captcha:this.userinfo.captcha,
						   password:this.userinfo.password,
						   phone:this.userinfo.phone
					    },
						method:"POST",
					    header: {
					        'content-type':'application/x-www-form-urlencoded' 
					    },
					    success: (res) => {
					        console.log(res);
							if(res.data.status==400){
								uni.showToast({
									title:res.data.msg,
									icon:'none'
								})
							}else{
								uni.showToast({
									title:"修改成功",
								})
								setTimeout(()=>{
									uni.navigateBack({
										
									})
								},1000)
							}
					        
					    },
						fail: (err) => {
							console.log(err)
						}
					});
					console.log("请求完毕")
				}
			},
			gologin() {
				uni.navigateTo({
					url: "../login/login"
				})
			},
			test() {
				uni.navigateBack({
					delta: 1
				})
			},
			testmima(){
				let mytoken =uni.getStorageSync("myToken")
				let username = "cui123"
				uni.request({
				    url: "http://a1.easemob.com/1124200715098531/lzim/chatgroups/122550905536513",
					method:"GET",
				    header: {
				        'content-type':'application/json' ,
						'Authori-zation': 'Bearer '+mytoken
				    },
				    success: (res) => {
				        console.log(res);	
						}
				});
				// let me = this;
				// let options={
				// 	username:'cui123',
				// 	newpassword:'11223344'
				// }
				// me.$im.conn.uppassword(options);
				// console.log("执行完毕")
			}
		},
	}
</script>

<style>
	.bottom_cont text:nth-child(1) {
		margin-bottom: 7px;
	}
	button::after {
		  border: none;
		}
	.bottom_cont text {

		top: 660px;
		width: 154px;
		color: rgba(16, 16, 16, 1);
		font-size: 14px;
		font-family: PingFangSC-regular;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-left: 50%;
		transform: translateX(-50%);
	}

	.wraptop {
		background-color: rgb(255, 255, 255);
		padding-bottom: 30%;
	}

	.content_input {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
		margin-top: 50px;
	}

	.input_cot {
		padding-left: 12px;
		width: 300px;
		height: 54px;
		line-height: 54px;
		border-radius: 20px;
		text-align: center;
		margin-bottom: 22px;
		color: rgba(16, 16, 16, 1);
		font-size: 14px;
		font-family: PingFangSC-regular;
	}

	.bottom_cont {
		margin-top: 32px;
	}

	.btn {

		background: -webkit-linear-gradient(left, #a00000, #e10004, #a00000);
		left: 107px;
		top: 578px;
		width: 164px;
		height: 50px;
		line-height: 20px;
		border-radius: 40px;
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-left: 50%;
		transform: translateX(-50%);

	}

	.btn text {
		color: #FFFFFF;
		left: 189px;
		top: 593px;
		width: 40px;
		height: 20px;
		font-size: 20px;
		text-align: center;
		font-family: PingFangSC-regular;
	}
</style>
